<template>
  <a-modal :visible="visible" :title="modalInfo.title" class="limit-modal" unmount-on-close width="85vw" @cancel="close">
    <InspectForm :params="params" ref="formRef" in-modal />
    <template #footer>
      <a-button @click="close">关闭</a-button>
      <a-button type="primary" @click="handleOkFn" :loading="loading">确认</a-button>
    </template>
  </a-modal>
</template>

<script setup>
  import { ref } from 'vue'
  import InspectForm from './form/index.vue'
  import { Message } from '@arco-design/web-vue'

  const emits = defineEmits(['ok'])

  const visible = ref(false)
  const params = ref({})
  // 编辑/新增
  const modalInfo = ref({})
  const open = (record) => {
    params.value = record
    visible.value = true
    // 新增or编辑
    modalInfo.value =
      record.mode === 'edit'
        ? {
            title: '编辑年检',
            msg: '修改年检成功！',
          }
        : {
            title: '新增年检',
            msg: '新增年检成功！',
          }
  }
  const close = () => {
    visible.value = false
    loading.value = false
  }

  const formRef = ref()
  const loading = ref(false)
  const handleOkFn = () => {
    loading.value = true
    formRef.value.submitFn(noticeSuccess)
  }
  const noticeSuccess = (success = true) => {
    loading.value = false
    if (success) {
      Message.success(modalInfo.value.msg)
      addInspectOk()
    }
  }

  const addInspectOk = () => {
    close()
    emits('ok', { ...formRef.value.form })
  }

  defineExpose({
    open,
  })
</script>
